
        const ul = document.querySelector('.banner ul')
        const console = document.querySelector('.console')
        const consoleLeft = document.querySelector('.console-left a')
        const consoleRight = document.querySelector('.console-right a')

        // 鼠标点击右箭头切换下一张图片
       let z = 0//    赋一个全局变量,当鼠标点击小圆点q的值就赋给了z
        consoleRight.addEventListener('click', function () {
            let liss = lis[0].className
            for (let i = 0; i < lis.length; i++) {
                if (i < lis.length - 1) {
                    lis[i].classList.remove(`${lis[i].className}`)
                    lis[i].classList.add(`${lis[i + 1].className}`)
                } else {
                    lis[i].classList.remove(`${lis[i].className}`)
                    lis[i].classList.add(`${liss}`)
                }
            }
            z++
            if (z>as.length-1)z=0
            document.querySelector('.banner-li li a.active').classList.remove('active')
                as[z].classList.add('active')
        })
        // 鼠标点击左箭头切换上一张图片
        const lis = document.querySelectorAll('.banner li')
        consoleLeft.addEventListener('click', function () {
           
            let liss = lis[lis.length - 1].className
            for (let i = lis.length - 1; i >= 0; i--) {
                if (i > 0) {
                    lis[i].classList.remove(`${lis[i].className}`)
                    lis[i].classList.add(`${lis[i - 1].className}`)
                } else {
                    lis[i].classList.remove(`${lis[i].className}`)
                    lis[i].classList.add(`${liss}`)
                }
            }
            z--
            if(z<0)z=as.length-1
            document.querySelector('.banner-li li a.active').classList.remove('active')
                as[z].classList.add('active')
        })
        // 自动轮播
        let next = setInterval(function () {
            consoleRight.click()
        }, 3000)
        // 鼠标悬停左右控件显示并且停止自动轮播事件
        function fn1() {
            let x1 = document.querySelector('a.conceal-left')
            if (x1) document.querySelector('a.conceal-left').classList.remove('conceal-left')
            consoleLeft.classList.add('show-left')
            let x2 = document.querySelector('a.conceal-right')
            if (x2) document.querySelector('a.conceal-right').classList.remove('conceal-right')
            consoleRight.classList.add('show-right')
            clearInterval(next)
        }
        // 鼠标离开左右控件显示并且开启自动轮播事件
        function fn2() {
            let y1 = document.querySelector('a.show-left')
            if (y1) document.querySelector('a.show-left').classList.remove('show-left')
            consoleLeft.classList.add('conceal-left')
            let y2 = document.querySelector('a.show-right')
            if (y1) document.querySelector('a.show-right').classList.remove('show-right')
            consoleRight.classList.add('conceal-right')
            next = setInterval(function () {
                consoleRight.click()
            }, 3000)
        }
        // 鼠标悬停
        const bannerLi = document.querySelector('.banner-li')
        console.addEventListener('mouseenter', fn1)
        ul.addEventListener('mouseenter', fn1)
        bannerLi.addEventListener('mouseenter', fn1)
        // 鼠标离开
        console.addEventListener('mouseleave', fn2)
        ul.addEventListener('mouseleave', fn2)
        bannerLi.addEventListener('mouseleave', fn2)
        // 鼠标点击小圆点控制轮播图并且变色
        const as = document.querySelectorAll('.banner-li li a ')
        for (let q = 0; q < as.length; q++) {
            as[q].addEventListener('click', function () {
                z = q
                document.querySelector('.banner-li li a.active').classList.remove('active')
                as[q].classList.add('active')
                if (q === 5) {
                    lis[q - 2].classList.remove(`${lis[q - 2].className}`)
                    lis[q - 2].classList.add(`p6`)
                    lis[q - 1].classList.remove(`${lis[q - 1].className}`)
                    lis[q - 1].classList.add(`p5`)
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p4`)
                    lis[q - 5].classList.remove(`${lis[q - 5].className}`)
                    lis[q - 5].classList.add(`p3`)
                    lis[q - 4].classList.remove(`${lis[q - 4].className}`)
                    lis[q - 4].classList.add(`p2`)
                    lis[q - 3].classList.remove(`${lis[q - 3].className}`)
                    lis[q - 3].classList.add(`p1`)
                } else if (q === 4) {
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p6`)
                    lis[q + 1].classList.remove(`${lis[q + 1].className}`)
                    lis[q + 1].classList.add(`p5`)
                    lis[q - 4].classList.remove(`${lis[q - 4].className}`)
                    lis[q - 4].classList.add(`p4`)
                    lis[q - 3].classList.remove(`${lis[q - 3].className}`)
                    lis[q - 3].classList.add(`p3`)
                    lis[q - 2].classList.remove(`${lis[q - 2].className}`)
                    lis[q - 2].classList.add(`p2`)
                    lis[q - 1].classList.remove(`${lis[q - 1].className}`)
                    lis[q - 1].classList.add(`p1`)
                } else if (q === 3) {
                    lis[q + 2].classList.remove(`${lis[q + 2].className}`)
                    lis[q + 2].classList.add(`p6`)
                    lis[q - 3].classList.remove(`${lis[q - 3].className}`)
                    lis[q - 3].classList.add(`p5`)
                    lis[q - 2].classList.remove(`${lis[q - 2].className}`)
                    lis[q - 2].classList.add(`p4`)
                    lis[q - 1].classList.remove(`${lis[q - 1].className}`)
                    lis[q - 1].classList.add(`p3`)
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p2`)
                    lis[q + 1].classList.remove(`${lis[q + 1].className}`)
                    lis[q + 1].classList.add(`p1`)
                } else if (q === 2) {
                    lis[q - 2].classList.remove(`${lis[q - 2].className}`)
                    lis[q - 2].classList.add(`p6`)
                    lis[q - 1].classList.remove(`${lis[q - 1].className}`)
                    lis[q - 1].classList.add(`p5`)
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p4`)
                    lis[q + 1].classList.remove(`${lis[q + 1].className}`)
                    lis[q + 1].classList.add(`p3`)
                    lis[q + 2].classList.remove(`${lis[q + 2].className}`)
                    lis[q + 2].classList.add(`p2`)
                    lis[q + 3].classList.remove(`${lis[q + 3].className}`)
                    lis[q + 3].classList.add(`p1`)
                } else if (q === 1) {
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p6`)
                    lis[q + 1].classList.remove(`${lis[q + 1].className}`)
                    lis[q + 1].classList.add(`p5`)
                    lis[q + 2].classList.remove(`${lis[q + 2].className}`)
                    lis[q + 2].classList.add(`p4`)
                    lis[q + 3].classList.remove(`${lis[q + 3].className}`)
                    lis[q + 3].classList.add(`p3`)
                    lis[q + 4].classList.remove(`${lis[q + 4].className}`)
                    lis[q + 4].classList.add(`p2`)
                    lis[q - 1].classList.remove(`${lis[q - 1].className}`)
                    lis[q - 1].classList.add(`p1`)
                } else if (q === 0) {
                    lis[q + 2].classList.remove(`${lis[q + 2].className}`)
                    lis[q + 2].classList.add(`p6`)
                    lis[q + 3].classList.remove(`${lis[q + 3].className}`)
                    lis[q + 3].classList.add(`p5`)
                    lis[q + 4].classList.remove(`${lis[q + 4].className}`)
                    lis[q + 4].classList.add(`p4`)
                    lis[q + 5].classList.remove(`${lis[q + 5].className}`)
                    lis[q + 5].classList.add(`p3`)
                    lis[q + 1].classList.remove(`${lis[q + 1].className}`)
                    lis[q + 1].classList.add(`p1`)
                    lis[q].classList.remove(`${lis[q].className}`)
                    lis[q].classList.add(`p2`)
                }
            })
        }
    